<template>
  <van-list
    v-model="loading"
    :finished="finished"
    finished-text="没有更多了"
    @load="onLoad"
  >
    <div  v-if="!isfull"  v-for="(item,index) in walletData" :key="index" style="background-color: #fff;border-bottom: 1px silver dashed " >
      <van-row style="height: 80px;">
        <van-col span="16" style="padding-top: 8px;padding-bottom:8px;padding-left: 6px;text-align: center">
          <span v-if="item.type=='1'" style="float: left"><van-tag type="success">支付宝充值</van-tag>&nbsp;&nbsp;{{item.desc}}</span>
          <span v-else-if="item.type=='2'" style="float: left"><van-tag type="success">银行卡充值</van-tag>&nbsp;&nbsp;{{item.desc}}</span>
          <span v-else-if="item.type=='3'" style="float: left" @click="withdraw(item.u_withdraw)"><van-tag type="danger">提现</van-tag>&nbsp;&nbsp;{{item.desc}}</span>
          <span v-else-if="item.type=='4'" style="float: left"><van-tag type="danger">转帐</van-tag>&nbsp;&nbsp;{{item.desc}}</span>
          <span v-else-if="item.type=='5'" style="float: left"><van-tag type="primary">提现失败退回</van-tag>&nbsp;&nbsp;{{item.desc}}</span>
          <span v-else-if="item.type=='6'" style="float: left"><van-tag type="success">佣金入账</van-tag>&nbsp;&nbsp;{{item.desc}}</span>
        </van-col>
        <van-col span="8" v-if="item.money>0" style="color: green;text-align: right;padding-top: 6px;padding-right: 6px;" >+{{item.money}}</van-col>
        <van-col span="8" v-else style="color: red;text-align: right;padding-top: 6px;padding-right: 6px;">{{item.money}}</van-col>
        <van-col span="16" style="padding-left: 6px;">{{item.created_at}}</van-col>
        <van-col span="8" style="text-align: right;padding-right: 6px;">余额：{{item.user_money}}</van-col>
      </van-row>
    </div>

  </van-list>

  <!--<div class="wallet">-->
    <!--&lt;!&ndash;<div class="banner">&ndash;&gt;-->
      <!--&lt;!&ndash;<div>&ndash;&gt;-->
        <!--&lt;!&ndash;<p>{{walletData.availmoney}}</p>&ndash;&gt;-->
        <!--&lt;!&ndash;<p>可用余额</p>&ndash;&gt;-->
      <!--&lt;!&ndash;</div>&ndash;&gt;-->
      <!--&lt;!&ndash;<div>&ndash;&gt;-->
        <!--&lt;!&ndash;<p>{{walletData.trading}}</p>&ndash;&gt;-->
        <!--&lt;!&ndash;<p>待发放佣金</p>&ndash;&gt;-->
      <!--&lt;!&ndash;</div>&ndash;&gt;-->
    <!--&lt;!&ndash;</div>&ndash;&gt;-->
    <!--<div class="null" v-if="isfull">-->
      <!--<img-->
        <!--src="../../assets/images/nullData.png"-->
        <!--alt=""-->
      <!--&gt;-->
      <!--<p>没有数据</p>-->
    <!--</div>-->
    <!--<div class="content" v-if="!isfull">-->



    <!--</div>-->

  <!--</div>-->
</template>
<script>

import { wallet } from "../../api/user";
import { Toast } from "vant";
export default {
  data() {
    return {
      isfull:true,
      walletData: [],
      firstLoad:true,  //第一次加载
      loading: false,
      finished: false,
      searchList: {
        total: 0,
        pageno: 0,
        pagesize:10,
      },
    };
  },
  methods: {
    withdraw(withdrawId){
      console.log(withdrawId)
      setTimeout(() => {
        this.$router.push({
          path: "/withdrawDatail?id="+withdrawId
        });
      }, 1000);
    },
    onLoad(){
      setTimeout(() => {

        console.log("000000000")
        if(this.firstLoad==false ){
          console.log("false")
          console.log(this.searchList.total)
          console.log(this.searchList.pagesize)
          console.log(this.searchList.pageno)
          if(this.searchList.total <= this.searchList.pagesize*(this.searchList.pageno-1)){
            console.log("return")
            return;
          }
        }

        wallet().then(res => {
          this.searchList.total = res.data.count;

          if (this.searchList.total > 0) {
            this.isfull = false;
          }

          if(this.searchList.total <= this.searchList.pagesize*this.searchList.pageno){
            this.finished = true;
          }

          for (let i = 0; i < res.data.list.length; i++) {
            this.walletData.push(res.data.list[i]);
          }

          console.log(this.walletData)
          this.loading = false;
          this.firstLoad = false
        });
      }, 1000);

      this.searchList.pageno= this.searchList.pageno+1;
    },
  },
  created() {
  }
};
</script>
<style lang="scss">
.wallet {
  width: 100%;
  background-color: #f5f5f5;
  header {
    color: #fff;
  }
  .null {
    position: fixed;
    left: 50%;
    top: 60%;
    transform: translate(-50%, -80%);
    p {
      padding-top: 8px;
      font-size: 16px;
      font-weight: 500;
      text-align: center;
      color: #999;
    }
  }
  .banner {
    display: flex;
    justify-content: space-between;
    display: -webkit-flex;
    height: 100px;
    background-color: #f61437;
    padding: 20px 0;
    div {
      // height: 100%;
      width: 50%;
      display: flex;
      justify-content: space-around;
      display: -webkit-flex;
      align-items: center;
      flex-direction: column;
      p {
        font-size: 16px;
        color: #fff;
      }
      p:first-child {
        font-weight: 700;
        font-size: 18px;
      }
    }
    div:first-child {
      border-right: 1px solid #fff;
    }
  }
  .content {
    /*width: 85%;*/
    margin: 0 auto;
  }
}
</style>

